<template>
	<view class="body-view">
		<!--导航和状态栏-->
		<view class="state-navigation">
			<view class="slim_header_navigation d-flex a-center j-center" >
				<view class="left_box" @tap="goBack">
					<image src="/static/center/back.png" class="back"></image>
				</view>
				<view class="d-flex">
					<view class="title title-front">{{title}}</view>
					<view class="title">的打卡记录</view>
				</view>
				<view class="right_box d-flex a-center j-center">
					<image v-if="currentUserId==userData.id" src="/static/image/share.png" class="share-image"></image>
					<!--
					<i class="icon icon-fenxiang" style="font-size: 60rpx; color: #000000;"></i>
					-->
					<!-- <image src="/static/center/dian.png" class="dian"></image> -->
				</view>
			</view>
		</view>
		<!-- 顶部位置占位 -->
		<view style="height:calc(100rpx + var(--status-bar-height));"></view>
		<view class="top-menu d-flex a-center j-between">
			<view class="top-menu-cell" v-for="(item,index) in menuList" :key="index" @tap="currentMenu = index" :class="{active:currentMenu==index}">{{item}}</view>
		</view>
		<swiper class="scroll-view" :current="currentMenu" :duration="0" :disable-programmatic-animation="true" :disable-touch="true">
			<!--全部记录--> 
			<swiper-item>
				<pullScroolView
					class="scroll-all"
					ref="scroll" 
					:back-top="false" 
					:pullDown="refresh" 
					:pullUp="scrolltolower">
					<view v-if="pageData?.list?.length==0" class="scroll-all d-flex d-c a-center j-center">
						<image src="@/static/img/nodata.png" style="width: 360rpx;height: 360rpx;"></image>
						<text style="font-size: 28rpx;font-family: PingFangSC, PingFang SC;font-weight: 400;color: #999999;">在该群内暂无打卡记录</text>
					</view>
					<template v-else v-for="(item,index) in pageData.list">
						<view v-if="isBreak(index).show" class="data-content">
							<view class="data-content-date">{{isBreak(index).title}}</view>
							<view class="data-content-null d-flex a-center j-center">
								<view class="left-null-text">{{isBreak(index).days>1?`共${isBreak(index).days}天未打卡`:`未打卡`}}</view>
							</view>
						</view>
						<view class="data-content">
							<view class="data-content-date">{{lastTwoDays(item.recordDate)}}{{isOne(index)?'（首次打卡）':''}}</view>
							<view v-if="item.groupUserClockResponseParam!=null" class="data-content-info">
								<!--头部信息-->
								<view class="content-info-row d-flex">
									<view class="row-head-cell" style="width: 33.33%;">
										<view class="head-cell-title">共摄入</view>
										<view class="head-cell-value d-flex">
											<view class="cell-value-number" style="color: #1DC691;">{{item.breakfast+item.lunch+item.dinner+item.addFood}}</view>
											<view class="cell-value-unit">&nbsp;千卡</view>
										</view>
									</view>
									<view class="row-head-cell" style="width: 33.33%;">
										<view class="d-flex">
											<view class="head-cell-title">共消耗</view>
											<view class="head-cell-describe" style="color: #999999;">&nbsp;(含静息)</view>
										</view>
										
										<view class="head-cell-value d-flex">
											<view class="cell-value-number" style="color: #FFAF67;">{{item.rest+countMotion(item)}}</view>
											<view class="cell-value-unit">&nbsp;千卡</view>
											
										</view>
									</view>
									<view class="row-head-cell" style="flex: 1;">
										<view class="head-cell-title">热量差</view>
										<view class="head-cell-value d-flex">
											<view v-if="countHeatGap(item)>=0" class="cell-value-number" style="color: #1DC691;">{{countHeatGap(item)}}</view>
											<view v-else class="cell-value-number" style="color: #FF6F57;">+{{-countHeatGap(item)}}</view>
											<view class="cell-value-unit">&nbsp;千卡</view>
										</view>
									</view>
								</view>
								<!--饮水记录-->
								<!--
								<view v-if="isRowShow(item,5)"  @tap="showDrinkWater(item)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,5)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									<view class="row-content-left" style="padding-right: 0;">
										<view class="content-left-title d-flex a-center">
											<image style="width: 40rpx;height: 40rpx;" src="@/static/image/cup.png"></image>
											<text class="left-title-text">饮水</text>
										</view>
									</view>
									<view class="row-content-right">
										<view class="content-drinking-row">
											<view class="drinking-row-top d-flex a-center j-center">
												<view class="row-top-value">{{item.water}}</view>
												<view class="row-top-unit">/{{item.needWater}}ml</view>
											</view>
											<view class="drinking-row-below">
												<view class="row-below-progress">
													<view class="progress-bottom d-flex j-between">
														<view class="progress-complete" :style="{ width : waterCompletion(item) + '%',borderRadius: waterCompletion(item) ==100?'6rpx': '6rpx 0 0 6rpx' }"></view>
														<view class="progress-grille"></view>
														<view class="progress-grille"></view>
														<view class="progress-grille"></view>
														<view class="progress-grille"></view>
														<view class="progress-grille"></view>
														<view class="progress-grille"></view>
														<view class="progress-grille"></view>
														<!--
														<view class="progress-complete" :style="{ width : waterCompletion(item) + '%' }"></view>
														<view class="progress-indicate" :style="{ left : waterCompletion(item) + '%' }">
															<image style="width: 100%;height: 100%;" src="/static/image/record-slider.png" ></image>
														</view>
														-->
													</view>
												</view>
											</view>
										</view>
										<!--
										<view v-else class="content-left-null d-flex a-center j-center" style="padding-left: 0;padding-right: 160rpx;">
											<view class="left-null-text">未打卡</view>
										</view>
										-->
									</view>
								</view>
								<!--早餐记录-->
								<!--
								<view v-if="isRowShow(item,1)" @tap="goDietGroupMenu(item,0)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,1)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									
									<view class="row-content-right">
										<view class="content-right-title d-flex a-center">
											<i class="icon icon-zaocan right-title-icon"></i>
											<text class="right-title-text">早餐</text>
										</view>
										<view v-for="items in item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 1)" class="content-food-row d-flex a-center j-between">
											<view class="food-row-title d-flex a-center">
												<view class="right-title-icon"></view>
												<text class="right-title-text">{{items.foodName}}</text>
												<text class="right-title-weight">&nbsp;·{{items.eatGrams}}{{items.unit}}</text>
											</view>
											<view class="food-row-param d-flex j-end">
												<text class="row-param-heat">{{items.eatHeatQuantity}}千卡</text>
											</view>
										</view>
										<!--
										<view v-if="item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 1).length<1" class="content-left-null d-flex a-center j-center">
											<view class="left-null-text">未打卡</view>
											
											<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
											
										</view>
										-->
									</view>
									<view class="row-content-left d-flex a-center j-center" :style="{paddingTop:item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 1).length>=3?'80rpx':'20rpx'}">
										<view class="d-flex j-around">
											<view v-if="imageConvertArray(item.breakfastImg).length>0" class="content-left-image d-flex j-center">
												<image :id="`breakfastImg-${index}-0`" @tap.stop="previewImage(`breakfastImg-${index}-`,0,imageConvertArray(item.breakfastImg))" mode="aspectFill" class="left-image-image" :src="imageConvertArray(item.breakfastImg)[0]"></image>
												<view v-if="imageConvertArray(item.breakfastImg).length>1" class="left-image-white"></view>
												<view v-if="imageConvertArray(item.breakfastImg).length>1" class="left-image-s"></view>
												<view v-if="imageConvertArray(item.breakfastImg).length>1" class="left-image-size">{{imageConvertArray(item.breakfastImg).length}}</view>
											</view>
											<view v-else class="content-left-null d-flex d-c a-center j-center">
												<i class="icon icon-tupianlv" style="color: #999999;font-size: 30rpx;"></i>
												<view class="left-null-text">未上传</view>
											</view>
										</view>
									</view>
								</view>
								<!--午餐记录-->
								<!--
								<view v-if="isRowShow(item,2)" @tap="goDietGroupMenu(item,1)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,2)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									<view class="row-content-right">
										<view class="content-right-title d-flex a-center">
											<i class="icon icon-wucan right-title-icon"></i>
											<text class="right-title-text">午餐</text>
										</view>
										<view v-for="items in item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 2)" class="content-food-row d-flex a-center j-between">
											<view class="food-row-title d-flex a-center">
												<view class="right-title-icon"></view>
												<text class="right-title-text">{{items.foodName}}</text>
												<text class="right-title-weight">&nbsp;·{{items.eatGrams}}{{items.unit}}</text>
											</view>
											<view class="food-row-param d-flex j-end">
												<text class="row-param-heat">{{items.eatHeatQuantity}}千卡</text>
											</view>
										</view>
										<!--
										<view v-if="item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 2).length<1" class="content-left-null d-flex a-center j-center">
											<view class="left-null-text">未打卡</view>
											
											<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
											
										</view>
										-->
									</view>
									<view class="row-content-left" :style="{paddingTop:item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 2).length>=3?'80rpx':'20rpx'}">
										<view class="d-flex j-around">
											<view v-if="imageConvertArray(item.lunchImg).length>0" class="content-left-image d-flex j-center">
												<image :id="`lunchImg-${index}-0`" @tap.stop="previewImage(`lunchImg-${index}-`,0,imageConvertArray(item.lunchImg))" mode="aspectFill" class="left-image-image" :src="imageConvertArray(item.lunchImg)[0]"></image>
												<view v-if="imageConvertArray(item.lunchImg).length>1" class="left-image-white"></view>
												<view v-if="imageConvertArray(item.lunchImg).length>1" class="left-image-s"></view>
												<view v-if="imageConvertArray(item.lunchImg).length>1" class="left-image-size">{{imageConvertArray(item.lunchImg).length}}</view>
											</view>
											<view v-else class="content-left-null d-flex d-c a-center j-center">
												<i class="icon icon-tupianlv" style="color: #999999;font-size: 30rpx;"></i>
												<view class="left-null-text">未上传</view>
											</view>
										</view>
									</view>
								</view>
								<!--晚餐记录-->
								<!--
								<view v-if="isRowShow(item,3)"  @tap="goDietGroupMenu(item,2)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,3)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									<view class="row-content-right">
										<view class="content-right-title d-flex a-center">
											<i class="icon icon-wancan right-title-icon"></i>
											<text class="right-title-text">晚餐</text>
										</view>
										<view v-for="items in item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 3)" class="content-food-row d-flex a-center j-between">
											<view class="food-row-title d-flex a-center">
												<view class="right-title-icon"></view>
												<text class="right-title-text">{{items.foodName}}</text>
												<text class="right-title-weight">&nbsp;·{{items.eatGrams}}{{items.unit}}</text>
											</view>
											<view class="food-row-param d-flex j-end">
												<text class="row-param-heat">{{items.eatHeatQuantity}}千卡</text>
											</view>
										</view>
										<!--
										<view v-if="item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 3).length<1" class="content-left-null d-flex a-center j-center">
											<view class="left-null-text">未打卡</view>
											
											<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
											
										</view>
										-->
									</view>
									<view class="row-content-left d-flex a-center j-center" :style="{paddingTop:item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 3).length>=3?'80rpx':'20rpx'}">
										<view class="d-flex j-around">
											<view v-if="imageConvertArray(item.dinnerImg).length>0" class="content-left-image d-flex j-center">
												<image :id="`dinnerImg-${index}-0`" @tap.stop="previewImage(`dinnerImg-${index}-`,0,imageConvertArray(item.dinnerImg))" mode="aspectFill" class="left-image-image" :src="imageConvertArray(item.dinnerImg)[0]"></image>
												<view v-if="imageConvertArray(item.dinnerImg).length>1" class="left-image-white"></view>
												<view v-if="imageConvertArray(item.dinnerImg).length>1" class="left-image-s"></view>
												<view v-if="imageConvertArray(item.dinnerImg).length>1" class="left-image-size">{{imageConvertArray(item.dinnerImg).length}}</view>
											</view>
											<view v-else class="content-left-null d-flex d-c a-center j-center">
												<i class="icon icon-tupianlv" style="color: #999999;font-size: 30rpx;"></i>
												<view class="left-null-text">未上传</view>
											</view>
										</view>
										<!--
										<view class="content-left-title d-flex a-center">
											<i class="icon icon-wancan left-title-icon"></i>
											<text class="left-title-text">晚餐</text>
										</view>
										-->
									</view>
								</view>
								<!--加餐记录-->
								<!--
								<view v-if="isRowShow(item,4)" @tap="goDietGroupMenu(item,3)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,4)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									
									<view class="row-content-right">
										<view class="content-right-title d-flex a-center">
											<i class="icon icon-jiacan right-title-icon"></i>
											<text class="right-title-text">加餐</text>
										</view>
										<view v-for="items in item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 4)" class="content-food-row d-flex a-center j-between">
											<view class="food-row-title d-flex a-center">
												<view class="right-title-icon"></view>
												<text class="right-title-text">{{items.foodName}}</text>
												<text class="right-title-weight">&nbsp;·{{items.eatGrams}}{{items.unit}}</text>
											</view>
											<view class="food-row-param d-flex j-end">
												<text class="row-param-heat">{{items.eatHeatQuantity}}千卡</text>
											</view>
										</view>
										<!--
										<view v-if="item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 4).length<1" class="content-left-null d-flex a-center j-center">
											<view class="left-null-text">未打卡</view>
											
											<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
											
										</view>
										-->
									</view>
									<view class="row-content-left d-flex a-center j-center" :style="{paddingTop:item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 4).length>=3?'80rpx':'20rpx'}">
										<view class="d-flex j-around">
											<view v-if="imageConvertArray(item.addFoodImg).length>0" class="content-left-image d-flex j-center">
												<image :id="`addFoodImg-${index}-0`" @tap.stop="previewImage(`addFoodImg-${index}-`,0,imageConvertArray(item.addFoodImg))" mode="aspectFill" class="left-image-image" :src="imageConvertArray(item.addFoodImg)[0]"></image>
												<view v-if="imageConvertArray(item.addFoodImg).length>1" class="left-image-white"></view>
												<view v-if="imageConvertArray(item.addFoodImg).length>1" class="left-image-s"></view>
												<view v-if="imageConvertArray(item.addFoodImg).length>1" class="left-image-size">{{imageConvertArray(item.addFoodImg).length}}</view>
											</view>
											<view v-else class="content-left-null d-flex d-c a-center j-center">
												<i class="icon icon-tupianlv" style="color: #999999;font-size: 30rpx;"></i>
												<view class="left-null-text">未上传</view>
											</view>
										</view>
										<!--
										<view class="content-left-title d-flex a-center">
											<i class="icon icon-jiacan left-title-icon"></i>
											<text class="left-title-text">加餐</text>
										</view>
										-->
									</view>
								</view>
								<!--运动记录-->
								<!--
								<view v-if="isRowShow(item,6)" @tap="goSportsGroupMenu(item)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,6)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									
									<view class="row-content-right">
										<view class="content-right-title d-flex a-center">
											<i class="icon icon-yundong right-title-icon"></i>
											<text class="right-title-text">运动</text>
										</view>
										<view v-for="items in item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 6)" class="content-food-row d-flex a-center j-between">
											<view class="food-row-title d-flex a-center">
												<!--
												<view class="right-title-icon"></view>
												-->
												<image v-if="items.sportsHeatLevel=='1'" style="width: 20rpx;height: 20rpx;" src="@/static/image/fire-3.png"></image>
												<image v-if="items.sportsHeatLevel=='2'" style="width: 20rpx;height: 20rpx;" src="@/static/image/fire-2.png"></image>
												<image v-if="items.sportsHeatLevel=='3'" style="width: 20rpx;height: 20rpx;" src="@/static/image/fire-1.png"></image>
												<text class="right-title-text">{{items.sportsName}}</text>
												<text class="right-title-weight">&nbsp;·{{items.sportsTime}}{{items.sportsUnit}}</text>
											</view>
											<view class="food-row-param d-flex j-end">
												<text class="row-param-heat">-{{items.sportsHeat}}千卡</text>
											</view>
										</view>
										<!--
										<view v-if="item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 6).length<1" class="content-left-null d-flex a-center j-center">
											<view class="left-null-text">未打卡</view>
											
											<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
											
										</view>
										-->
									</view>
									<view class="row-content-left d-flex a-center j-center" :style="{paddingTop:item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 6).length>=3?'80rpx':'20rpx'}">
										<view class="d-flex j-around">
											<view v-if="imageConvertArray(item.sportsImg).length>0" class="content-left-image d-flex j-center">
												<image :id="`sportsImg-${index}-0`" @tap.stop="previewImage(`sportsImg-${index}-`,0,imageConvertArray(item.sportsImg))" mode="aspectFill" class="left-image-image" :src="imageConvertArray(item.sportsImg)[0]"></image>
												<view v-if="imageConvertArray(item.sportsImg).length>1" class="left-image-white"></view>
												<view v-if="imageConvertArray(item.sportsImg).length>1" class="left-image-s"></view>
												<view v-if="imageConvertArray(item.sportsImg).length>1" class="left-image-size">{{imageConvertArray(item.sportsImg).length}}</view>
											</view>
											<view v-else class="content-left-null d-flex d-c a-center j-center">
												<i class="icon icon-tupianlv" style="color: #999999;font-size: 30rpx;"></i>
												<view class="left-null-text">未上传</view>
											</view>
										</view>
										<!--
										<view class="content-left-title d-flex a-center">
											<image style="width: 40rpx;height: 40rpx;" src="@/static/image/icon-sports.png"></image>
											<text class="left-title-text">运动</text>
										</view>
										-->
									</view>
								</view>
								<!--体重记录-->
								<!--
								<view v-if="isRowShow(item,7)" @tap="showWeightRecord(item)" class="content-info-row d-flex a-center">
								-->
								<view v-if="isRowShow(item,7)" class="content-info-row d-flex a-center">
									<view class="row-content-divider"></view>
									<view class="row-content-right">
										<view class="content-right-title d-flex a-center">
											<i class="icon icon-tizhong right-title-icon"></i>
											<text class="right-title-text">体重</text>
										</view>
										<view v-for="items in item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 7)" class="content-weight-row">
											<view class="weight-row-top d-flex a-center j-center">
												<view class="d-flex a-center">
													<text class="row-top-text">最新</text>
													<text class="row-top-number">{{items.weight}}</text>
													<text class="row-top-text">KG</text>
												</view>
												<!--
												<view class="d-flex a-center">
													<text class="row-top-text">较上次：{{items.difference<0?'+':''}}{{-items.difference}}kg</text>
												</view>
												-->
											</view>
											<view class="weight-row-below d-flex a-center j-between">
												<view class="row-below-title">
													<view class="below-title-text">初始</view>
													<view class="below-title-value">
														<text class="title-value-number">{{items.initWeight}}</text>
														<text class="title-value-unit">KG</text>
													</view>
												</view>
												<view class="row-below-progress">
													<view class="progress-bottom">
														<view class="progress-complete" :style="{ width : completion(items) + '%' }"></view>
														<view class="progress-indicate" :style="{ left : completion(items) + '%' }">
															<view class="progress-indicate-number">{{completion(items)}}%</view>
															<image style="width: 100%;height: 100%;" src="/static/image/record-slider.png" ></image>
														</view>
													</view>
												</view>
												<view class="row-below-title" style="padding-left: 25rpx;">
													<view class="below-title-text">目标</view>
													<view class="below-title-value">
														<text class="title-value-number">{{items.aimWeight}}</text>
														<text class="title-value-unit">KG</text>
													</view>
												</view>
											</view>
											<view class="weight-row-contrast">较上次：{{items.difference<0?'+':''}}{{-items.difference}}kg</view>
										</view>
										<!--
										<view v-if="item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 7).length<1" class="content-left-null d-flex a-center j-center">
											<view class="left-null-text">未打卡</view>
											
											<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
											
										</view>
										-->
									</view>
									<view class="row-content-left" style="padding-top: 80rpx;">
										<view class="d-flex j-around">
											<view v-if="imageConvertArray(getWeightImage(item)).length>0" class="content-left-image d-flex j-center">
												<image :id="`weightImg-${index}-0`" @tap.stop="previewImage(`weightImg-${index}-`,0,imageConvertArray(getWeightImage(item)))" mode="aspectFill" class="left-image-image" :src="imageConvertArray(getWeightImage(item))[0]"></image>
												<view v-if="imageConvertArray(item.sportsImg).length>1" class="left-image-white"></view>
												<view v-if="imageConvertArray(getWeightImage(item)).length>1" class="left-image-s"></view>
												<view v-if="imageConvertArray(getWeightImage(item)).length>1" class="left-image-size">{{imageConvertArray(getWeightImage(item)).length}}</view>
											</view>
											<view v-else class="content-left-null d-flex d-c a-center j-center">
												<i class="icon icon-tupianlv" style="color: #999999;font-size: 30rpx;"></i>
												<view class="left-null-text">未上传</view>
											</view>
										</view>
										<!--
										<view class="content-left-title d-flex a-center">
											<image style="width: 40rpx;height: 40rpx;" src="@/static/image/icon-weight.png"></image>
											<text class="left-title-text">体重</text>
										</view>
										-->
									</view>
								</view>
							</view>
							<!--
							<view @tap="goDietGroupMenu(item,0)" v-else class="data-content-null d-flex a-center j-center">
							-->
							<view v-else class="data-content-null d-flex a-center j-center">
								<view class="left-null-text">未打卡</view>
								<!--
								<view v-if="isThreeDays(item.recordDate)&&currentUserId==userData.id" class="left-null-a">补充打卡</view>
								-->
							</view>
						</view>
					</template>
					<view style="height: 40rpx;"></view>
				</pullScroolView>
			</swiper-item>
			<!--饮食记录-->
			<swiper-item>
				<pullScroolView
					class="scroll-all"
					ref="scrollFood" 
					:back-top="false" 
					:pullDown="refreshFoodRecord"
					:pullUp="scrollNull">
					<view v-if="foodRecord?.list?.length==0" class="scroll-all d-flex d-c a-center j-center">
						<image src="@/static/img/nodata.png" style="width: 360rpx;height: 360rpx;"></image>
						<text style="font-size: 28rpx;font-family: PingFangSC, PingFang SC;font-weight: 400;color: #999999;">在该群内暂无打卡记录</text>
					</view>
					<view v-else class="other-tab">
						<view class="top-overview d-flex d-c a-center j-center">
							<view class="top-overview-title">7日平均热量差</view>
							<view class="top-overview-value d-flex">
								<view class="overview-value-number">{{averageHeatGap(foodRecord?.list)}}</view>
								<view class="overview-value-unit">千卡</view>
							</view>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center j-between">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">热量差趋势</view>
								</view>
								<!--
								<view class="d-flex a-center">
									<view class="piece-title-button">查看大图</view>
									<i class="icon icon-more-2" style="font-size: 20rpx;color: #1DC691;"></i>
								</view>
								-->
							</view>
							<!--食物统计图-->
							<echartsFood :optionData="optionDataFood" @updateData="updateFood"></echartsFood>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">热量记录</view>
									<view class="piece-title-describe">(共{{foodRecord.total}}次记录)</view>
								</view>
							</view>
							<view class="content-piece-info">
								<view class="piece-info-row d-flex a-center j-between">
									<view class="info-row-title"></view>
									<view class="info-row-title">摄入</view>
									<view class="info-row-title">消耗(含运动)</view>
									<view class="info-row-title">热量差</view>
								</view>
								<template v-for="(item,index) in foodRecord.list" :key="index">
									<view v-if="index<7" class="piece-info-row d-flex a-center j-between">
										<view class="info-row-date">{{moment(item.recordDate,"YYYY-MM-DD").format("YYYY/MM/DD")}}</view>
										<view class="info-row-value d-flex a-center j-center">
											<view class="row-value-number">{{item.breakfast+item.lunch+item.dinner+item.addFood}}</view>
											<view class="row-value-unit">千卡</view>
										</view>
										<view class="info-row-value d-flex a-center j-center">
											<view class="row-value-number">{{item.sports+item.rest}}</view>
											<view class="row-value-unit">千卡</view>
										</view>
										<!--
										<view v-if="countHeatGap(item)>=0" class="cell-value-number" style="color: #1DC691;">{{countHeatGap(item)}}</view>
										<view v-else class="cell-value-number" style="color: #FF6F57;">+{{-countHeatGap(item)}}</view>
										-->
										<view v-if="countHeatGap2(item)>=0" class="info-row-value d-flex a-center j-center">
											<view class="row-value-number" style="color: #1DC691;">{{countHeatGap2(item)}}</view>
											<view class="row-value-unit" style="color: #1DC691;">千卡</view>
										</view>
										<view v-else class="info-row-value d-flex a-center j-center">
											<view class="row-value-number" style="color: #FF6F57;">{{countHeatGap2(item)}}</view>
											<view class="row-value-unit" style="color: #FF6F57;">千卡</view>
										</view>
									</view>
								</template>
							</view>
						</view>
					</view>
					<view style="height: 40rpx;"></view>
				</pullScroolView>	
			</swiper-item>
			<!--饮水记录-->
			<swiper-item>
				<pullScroolView
					class="scroll-all"
					ref="scrollWater" 
					:back-top="false" 
					:pullDown="refreshWaterRecord"
					:pullUp="scrollNull">
					<view v-if="waterRecord?.list?.length==0" class="scroll-all d-flex d-c a-center j-center">
						<image src="@/static/img/nodata.png" style="width: 360rpx;height: 360rpx;"></image>
						<text style="font-size: 28rpx;font-family: PingFangSC, PingFang SC;font-weight: 400;color: #999999;">在该群内暂无打卡记录</text>
					</view>
					<view v-else class="other-tab">
						<view class="top-overview d-flex d-c a-center j-center">
							<view v-if="waterProportion>=1.2" class="top-overview-explain" style="background: #FFEFE1;color: #FF9434;">饮水过量</view>
							<view v-if="waterProportion<0.5" class="top-overview-explain" style="background: #FFE3D9;color: #E8612E;">严重不足</view>
							<view v-if="waterProportion<0.8&&waterProportion>=0.5" class="top-overview-explain" style="background: #FFEFE1;color: #FF9434;">饮水不足</view>
							<view v-if="waterProportion<1.2&&waterProportion>=0.8" class="top-overview-explain" style="background: #D3F9ED;color: #1DC691;">饮水充足</view>
							<view class="top-overview-title">7日平均饮水量</view>
							<view class="top-overview-value d-flex">
								<view class="overview-value-number">{{averageWater(waterRecord?.list)}}</view>
								<view class="overview-value-unit">ml</view>
							</view>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center j-between">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">饮水趋势</view>
								</view>
								<!--
								<view class="d-flex a-center">
									<view class="piece-title-button">查看大图</view>
									<i class="icon icon-more-2" style="font-size: 20rpx;color: #1DC691;"></i>
								</view>
								-->
							</view>
							<!--饮水统计图-->
							<echartsWater :optionData="optionDataWater" @updateData="updateWater"></echartsWater>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">饮水记录</view>
									<view class="piece-title-describe">(共{{waterRecord.total}}次记录)</view>
								</view>
							</view>
							<view class="content-piece-info">
								<template v-for="(item,index) in waterRecord.list" :key="index">
									<view v-if="index<7" class="piece-info-row d-flex a-center j-between">
										<view class="info-row-date" style="width: 33.3%;">{{moment(item.recordDate,"YYYY-MM-DD").format("YYYY/MM/DD")}}</view>
										<view class="info-row-value d-flex a-center j-center" style="width: 33.3%;">
											<view class="row-value-number">{{item.water}}/{{item.needWater}}</view>
											<view class="row-value-unit">ml</view>
										</view>
										<view class="info-row-value d-flex a-center j-end" style="width: 33.3%;">
											<view v-if="countDateDrinkWater(item)>=1.2" class="row-value-explain" style="background: #FFEFE1;color: #FF9434;">饮水过量</view>
											<view v-if="countDateDrinkWater(item)<0.5" class="row-value-explain" style="background: #FFE3D9;color: #E8612E;">严重不足</view>
											<view v-if="countDateDrinkWater(item)<0.8&&countDateDrinkWater(item)>=0.5" class="row-value-explain" style="background: #FFEFE1;color: #FF9434;">饮水不足</view>
											<view v-if="countDateDrinkWater(item)<1.2&&countDateDrinkWater(item)>=0.8" class="row-value-explain" style="background: #D3F9ED;color: #1DC691;">饮水充足</view>
										</view>
										
										
									</view>
								</template>
							</view>
						</view>
					</view>
					<view style="height: 40rpx;"></view>
				</pullScroolView>	
			</swiper-item>
			<!--运动记录-->
			<swiper-item>
				<pullScroolView
					class="scroll-all"
					ref="scrollSports" 
					:back-top="false" 
					:pullDown="refreshSportsRecord"
					:pullUp="scrollNull">
					<view v-if="sportsRecord?.list?.length==0" class="scroll-all d-flex d-c a-center j-center">
						<image src="@/static/img/nodata.png" style="width: 360rpx;height: 360rpx;"></image>
						<text style="font-size: 28rpx;font-family: PingFangSC, PingFang SC;font-weight: 400;color: #999999;">在该群内暂无打卡记录</text>
					</view>
					<view v-else class="other-tab">
						<view class="top-overview d-flex d-c a-center j-center">
							<view class="top-overview-title">7日平均运动消耗</view>
							<view class="top-overview-value d-flex">
								<view class="overview-value-number">{{averageSports(sportsRecord?.list)}}</view>
								<view class="overview-value-unit">千卡</view>
							</view>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center j-between">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">热量差趋势</view>
								</view>
								<!--
								<view class="d-flex a-center">
									<view class="piece-title-button">查看大图</view>
									<i class="icon icon-more-2" style="font-size: 20rpx;color: #1DC691;"></i>
								</view>
								-->
							</view>
							<!--运动统计图-->
							<echartsSports :optionData="optionDataSports" @updateData="updateSports"></echartsSports>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">运动记录</view>
									<view class="piece-title-describe">(共{{sportsRecord.total}}次记录)</view>
								</view>
							</view>
							<view class="content-piece-info">
								<template v-for="(item,index) in sportsRecord.list" :key="index">
									<view v-if="index<7" class="piece-info-row d-flex a-center j-between" style="height: auto;padding: 20rpx 0;">
										<view class="info-row-date">{{moment(item.recordDate,"YYYY-MM-DD").format("YYYY/MM/DD")}}</view>
										<view class="info-row-sports">
											<view v-for="(items) in item.groupUserClockResponseParam" class="d-flex a-center">
												<view class="row-sports-name">{{items.sportsName}}</view>
												<view class="row-sports-time">{{items.sportsTime}}{{items.sportsUnit}}</view>
											</view>
										</view>
										<view class="info-row-value d-flex a-center j-between" style="width: 180rpx;">
											<view class="d-flex a-center">
												<i v-if="imageConvertArray(item.sportsImg).length>0" :id="`sports-list-${index}-0`" @tap.stop="previewImage(`sports-list-${index}-`,0,imageConvertArray(item.sportsImg))" class="icon icon-tupianlv" style="color: #1DC691;font-size: 40rpx;"></i>
											</view>
											<view class="d-flex a-center j-end">
												<view class="row-value-number" style="color: #1DC691;">-{{item.sports}}</view>
												<view class="row-value-unit" style="color: #1DC691;">千卡</view>
											</view>
										</view>
									</view>
								</template>
							</view>
						</view>
					</view>
					<view style="height: 40rpx;"></view>
				</pullScroolView>	
			</swiper-item>
			<!--体重记录-->
			<swiper-item>
				<pullScroolView
					class="scroll-all"
					ref="scrollAimWeight" 
					:back-top="false" 
					:pullDown="refreshAimWeightRecord"
					:pullUp="scrollNull">
					<view v-if="aimWeightRecord?.list?.length==0" class="scroll-all d-flex d-c a-center j-center">
						<image src="@/static/img/nodata.png" style="width: 360rpx;height: 360rpx;"></image>
						<text style="font-size: 28rpx;font-family: PingFangSC, PingFang SC;font-weight: 400;color: #999999;">在该群内暂无打卡记录</text>
					</view>
					<view v-else class="other-tab">
						<view class="top-overview d-flex d-c a-center j-center" style="padding:0 0 20rpx 30rpx;height: auto;">
							<view class="overview-aimWeight-up">上次称重 {{moment(aimWeightRecord?.list?.[0]?.createTime,"YYYY-MM-DD HH:mm:ss").format("M月D日mm:ss")}}</view>
							<view class="overview-aimWeight-title">最新体重</view>
							<view class="d-flex">
								<view class="overview-aimWeight-number">{{aimWeightRecord?.list?.[0].aimWeight}}</view>
								<view class="overview-aimWeight-unit">KG</view>
							</view>
							<view class="weight-row-below d-flex a-center j-between">
								<view class="row-below-title">
									<view class="below-title-text">初始</view>
									<view class="below-title-value">
										<text class="title-value-number">{{aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0]?.initWeight}}</text>
										<text class="title-value-unit">KG</text>
									</view>
								</view>
								<view class="row-below-progress">
									<view class="progress-bottom">
										<view class="progress-complete" :style="{ width : completion(aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0]) + '%' }"></view>
										<view class="progress-indicate" :style="{ left : completion(aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0]) + '%' }">
											<view v-if="completion(aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0])<50" class="progress-indicate-reduce" style="right: -160rpx;text-align: left;">已减{{aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0].difference.replace("-", "")}}kg</view>
											<view v-else class="progress-indicate-reduce" style="left: -160rpx;text-align: right;">已减{{aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0].difference.replace("-", "")}}KG</view>
											<view class="progress-indicate-number">{{completion(aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0])}}%</view>
											<image style="width: 100%;height: 100%;" src="/static/image/record-slider.png" ></image>
										</view>
									</view>
								</view>
								<view class="row-below-title" style="padding-left: 25rpx;">
									<view class="below-title-text">目标</view>
									<view class="below-title-value">
										<text class="title-value-number">{{aimWeightRecord?.list?.[0]?.groupUserClockResponseParam?.[0]?.aimWeight}}</text>
										<text class="title-value-unit">KG</text>
									</view>
								</view>
							</view>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center j-between">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">体重趋势</view>
								</view>
								<!--
								<view class="d-flex a-center">
									<view class="piece-title-button">查看大图</view>
									<i class="icon icon-more-2" style="font-size: 20rpx;color: #1DC691;"></i>
								</view>
								-->
							</view>
							<!--体重统计图-->
							<echartsAimWeight :optionData="optionDataAimWeight" @updateData="updateAimWeight"></echartsAimWeight>
						</view>
						<view class="content-piece">
							<view class="content-piece-title d-flex a-center j-between">
								<view class="d-flex a-center">
									<view class="piece-title-mark"></view>
									<view class="piece-title-text">体重记录</view>
								</view>
								<view class="piece-title-describe">(共{{aimWeightRecord.total}}次记录)</view>
							</view>
							<view class="content-piece-info">
								<template v-for="(item,index) in aimWeightRecord.list" :key="index">
									<view v-if="index<7" class="piece-info-row d-flex a-center j-between">
										<view class="info-row-date" style="width: 140rpx;">{{moment(item.recordDate,"YYYY-MM-DD").format("YYYY/MM/DD")}}</view>
										<view class="info-row-aimWeight">{{item.aimWeight}}KG</view>
										<view style="width: 40rpx;">
											<i v-if="imageConvertArray(item?.groupUserClockResponseParam?.[0]?.weightImgUrl).length>0" :id="`weight-list-${index}-0`" @tap.stop="previewImage(`weight-list-${index}-`,0,imageConvertArray(item?.groupUserClockResponseParam?.[0]?.weightImgUrl))" class="icon icon-tupianlv" style="color: #1DC691;font-size: 40rpx;"></i>
										</view>
										<view class="d-flex">
											<view class="info-row-aimWeight" style="width: 140rpx;padding-right: 20rpx;">BMI&nbsp;{{countBMI(item.aimWeight,aimWeightRecord?.stature)}}</view>
											<view v-if="countBMI(item.aimWeight,aimWeightRecord?.stature)>23.9" class="info-row-tip" style="background: #FFE3D9;color: #E8612E;">肥胖</view>
											<view v-else class="info-row-tip" style="background: #D3F9ED;color: #1DC691;">正常</view>
										</view>
									</view>
								</template>
							</view>
						</view>
					</view>
					<view style="height: 40rpx;"></view>
				</pullScroolView>	
			</swiper-item>
		</swiper>
		<weightRecord ref="weightRecordPopup" :groupId="groupId" :recordDate="recordDate" :initial-vlue="currentWeight" @onCloseWeight="refresh"></weightRecord>
		<drinkWater ref="drinkWaterPopup" :groupId="groupId" :recordDate="recordDate" :totalWater="totalWater" @submitWater="refresh"></drinkWater>
		<quoteWater ref="quoteWaterPopup" :groupId="groupId" :recordDate="recordDate" @openDrinkWater="openDrinkWater" @refreshData="refresh"></quoteWater>
		<imagePreview ref="preview" @onChange="imageChange"></imagePreview>
        <statement></statement>
		
	</view>
</template>

<script setup lang="tsx" name="clockinRecord">
import { userData as userDataStore } from "@/store/userData";
import { ref,nextTick } from "vue";
import { getGroupUserHealthRecord,getFoodRecord,getUserDetail,getGroupUserHealthRecordType } from "@/api/api";
import { onLoad,onShow } from "@dcloudio/uni-app";
import moment from "moment";
import { imageConvertArray,getHDImages } from "@/utils/format";
import drinkWater from "./components/drinkWater.vue";
import weightRecord from "./components/weightRecord.vue";
import quoteWater from "./components/quoteWater.vue";
import imagePreview from "@/components/imagePreview.vue";
import echartsFood from "./components/echartsFood.vue";
import echartsWater from "./components/echartsWater.vue";
import echartsSports from "./components/echartsSports.vue";
import echartsAimWeight from "./components/echartsAimWeight.vue";
import statement from "@/components/statement.vue";


import BigNumber from "bignumber.js";

const menuList:any = ref(["全部","饮食","饮水","运动","体重"]);
const currentMenu = ref(0);

const userData: any = ref(userDataStore());
const goBack = () => {
	uni.navigateBack();
};
const groupId = ref();
const recordDate = ref();
const totalWater = ref(0);
const currentWeight = ref(60);

let pageData:any = ref({});

let params = {
	userId:userData.value.id,
	groupId:"",
	page:1,
	rows:15
}
const title = ref();
const getTitle = () => {
	if(currentUserId.value==userData.value.id){
		title.value = "我";
	}else{
		getUserDetail({ id: currentUserId.value }).then((res:any) => {
			if (res.success){
				//title.value = "张三李四"
				title.value = res.data.nickName;
				if(title.value.length > 4){
					title.value = title.value.substring(0, 4) + "..."; 
				}
			}
		});
	}
}
//页面加载完成后加载初始数据
const currentUserId = ref();
onLoad((options:any) => {
	params.groupId = options.groupId; 
	groupId.value = options.groupId;
	if(options.userId!=null&&options.userId!=""){
		params.userId = options.userId; 
		currentUserId.value =  options.userId; 
	}
	refresh();
	getTitle();
	//获取群饮食记录
	//refreshFoodRecord();
});
onShow(() => {
	refresh();
});
const scroll = ref();
//下拉刷新数据
const refresh = () => {
	params.page = 1;//设置刷新时查询第一页
	getGroupUserHealthRecord(params).then((res: any) => {
		if(res.success){
			if(params.page!=res.data.pages)params.page++;//设置下一页
			//res.data.list = [];
			pageData.value = res.data;
			setTimeout(()=>{
			    scroll.value.success();
			},500);
			firstThreeDays();
			
			//获取群饮食记录
			refreshFoodRecord();
			//获取群饮水记录
			refreshWaterRecord();
			//获取群运动记录
			refreshSportsRecord();
			//获取群体重记录
			refreshAimWeightRecord();
		}
	}); 
}
//下拉加载
const scrolltolower = () => {
	//console.log(pageData.value)
	if(params.page>=pageData.value.pages)return;
	getGroupUserHealthRecord(params).then((res: any) => {
		params.page++;//设置下一页
		pageData.value.list.push(...res.data.list)
	});
}
//格式化日期为“今天、昨天、或前天”
const lastTwoDays = (dateStr:string) =>{
	let date = moment(dateStr,"YYYY-MM-DD");
	let diff = Math.abs(moment().diff(date, "days"));
	let result = date.format('M月D日');
	switch(diff){
		case 0:  
		    result = "今天";
			break;
		case 1:
			result = "昨天";
			break;
		case 2:
		    result = "前天";
			break; 
	}
	return result;
}
//判断是否在三天内
const isThreeDays = (dateStr:string) =>{
	let date = moment(dateStr,"YYYY-MM-DD");
	let diff = Math.abs(moment().diff(date, "days"));
	return diff<3;
}
//显示喝水打卡
const quoteWaterPopup = ref();
const showDrinkWater = (item:any) => {
	if(!isThreeDays(item.recordDate)||currentUserId.value!=userData.value.id)return;
	recordDate.value = item.recordDate;
	totalWater.value = item.needWater;
	nextTick(() => {
		let params = {
			userId:currentUserId.value,
			recordDate:recordDate.value,
			type:5,
		}
		//查询当日是否有饮水记录，有则选择是否引用
		getFoodRecord(params).then((res:any) => {
			let isUserWater = false;
			if(res.success){
				if(res.data.userHealthRecordDetails!=null&&res.data.userHealthRecordDetails.length>0){
					isUserWater = true;
				}
			}
			if(item.water == 0&&isUserWater){
				quoteWaterPopup.value.open();
			}else{
				openDrinkWater();
			}
		});
	});
}
const drinkWaterPopup = ref();
const openDrinkWater = () => {
	drinkWaterPopup.value.open();
}
//跳转至食物打卡
const goDietGroupMenu = (item:any,type:number) => {
	if(!isThreeDays(item.recordDate)||currentUserId.value!=userData.value.id)return;
	uni.navigateTo({
		url:`/pages/dietGroupMenu/dietGroupMenu?groupId=${groupId.value}&type=${type}&recordDate=${item.recordDate}`
	});
}
//跳转至运动打卡
const goSportsGroupMenu = (item:any) => {
	if(!isThreeDays(item.recordDate)||currentUserId.value!=userData.value.id)return;
	uni.navigateTo({
		url:`/pages/sportsGroupMenu/sportsGroupMenu?groupId=${groupId.value}&recordDate=${item.recordDate}`
	});
}
//计算完成度
const completion = (item:any) => {
	if(item==null)return 0;
	let schedule = 0;
	let aim = new BigNumber(item.initWeight).minus(new BigNumber(item.aimWeight));//目标减重
	//console.log(aim.toNumber())
	//let complete = initWeight.minus(new BigNumber(userWeightRecord.value.weight))//当前减重-item.difference
	let finish = new BigNumber(item.initWeight).minus(new BigNumber(item.weight));//完成减重
	schedule = Math.round(finish.div(aim).times(new BigNumber(100)).toNumber());
	if(schedule<0)schedule=0;
	if(schedule>100)schedule=100;
	return schedule;
}
//计算喝水完成度
const waterCompletion = (item:any) => {
	let schedule = 0;
	let aim = new BigNumber(item.needWater);
	schedule = Math.round(new BigNumber(item.water).div(aim).times(new BigNumber(100)).toNumber());
	if(schedule<0)schedule=0;
	if(schedule>100)schedule=100;
	return schedule;
}
const weightRecordPopup = ref(); //体重控件
const showWeightRecord = (item:any) => {
	if(!isThreeDays(item.recordDate)||currentUserId.value!=userData.value.id)return;
	
	recordDate.value = item.recordDate;
	
	let list =  item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 7);
	if(list.length > 0)currentWeight.value = list[0].weight;
	//if(currentWeight.value==0)currentWeight.value = 60;
	
	nextTick(() => {
		weightRecordPopup.value.open();
	});
};
const getWeightImage = (item:any) => {
	let imageStr = "";
	let list =  item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 7);
	if(list.length>0){
		imageStr = list[0].weightImgUrl;
	}
	return imageStr;
}
//补齐前三天
const firstThreeDays = () => {
	let list = pageData.value.list;
	for(let i=2;i>=0;i--){
		let targetDate = moment().subtract(i,'days').format("YYYY-MM-DD"); 
		list.unshift({
			"groupId": "100017",
			"groupUserClockResponseParam":null,
			"recordDate":targetDate
		});
	}
	for(let i=2;i>=0;i--){
		let targetDate = moment().subtract(i,'days').format("YYYY-MM-DD");
		let indices = list.reduce((accumulator:any, currentValue:any, index:number) => {  
		    if (currentValue.recordDate == targetDate) {  
		        accumulator.push(index);  
		    }  
		    return accumulator;  
		}, []);  
		if(indices.length==2){
			list[indices[0]] = JSON.parse(JSON.stringify(list[indices[1]]));
			list.splice(indices[1], 1); 
		}
	}
	if(list.length<4){
		for(let i=2;i>=0;i--){
			if(list[i].groupUserClockResponseParam==null)list.splice(i, 1); 
		}
	}
}
//折叠显示未打卡
const isBreak = (index:number) => {
	let json = {
		show:false,
		title:'',
		days:0,
	};
	//从第三天开始
	if(index>2){
		let list = pageData.value.list;
		let startDate = moment(list[index-1].recordDate).format("YYYY-MM-DD");
		let endDate = moment(list[index].recordDate).format("YYYY-MM-DD");
		
		
		let diffInDays = moment(startDate).diff(moment(endDate), 'days');
		if(diffInDays==2){
			json.show = true;
			let days = moment(startDate).subtract(1, 'days').format("YYYY-MM-DD");  
			json.title = lastTwoDays(days);
			let diffInDays = moment(startDate).diff(moment(endDate), 'days');
			json.days = diffInDays -1 
		}
		if(diffInDays>2){
			json.show = true;
			let days = moment(endDate).add(1, 'days').format("YYYY-MM-DD"); 
			let showStartDate = moment(startDate).subtract(1, 'days').format("YYYY-MM-DD");
			json.title = lastTwoDays(days)+"-"+lastTwoDays(showStartDate);
			
			let diffInDays = moment(startDate).diff(moment(endDate), 'days');
			json.days = diffInDays -1 
		}
	}
	return json;
}
//判断是否为首次打卡
const isOne = (index:number) => {
	let end = pageData.value.list[index+1];
	if(end==null&&params.page==pageData.value.pages){
		return true;
	}
	return false;
}
//图片预览
const preview = ref();
const previewImage = (id:string,index:number,urls:any) => {
	uni.createSelectorQuery().select(`#${id}${index}`).boundingClientRect().exec((ret)=>{
		//e.callback(ret[0])
		let params = {
			startInfo:[ret[0]],//图片的初始大小与位置
			idPre:id,
			index:index,//当前图片地址
			urls:getHDImages(urls),//预览集合图片地址
		}
		preview.value.open(params);
	});
}
const imageChange = (e:any) => {
	try{
		uni.createSelectorQuery().select(`#${e.id}${e.index}`).boundingClientRect().exec((ret)=>{
			uni.$emit("imagePreviewUpdate",ret[0])
		});
	}catch(e){
		uni.$emit("imagePreviewUpdate",null)
	}
}
//判断该行是否显示
const isRowShow = (item:any,type:number) => {
	if(item.groupUserClockResponseParam?.filter((obj:any) => obj.type == type).length<1){
		/*
		if(currentUserId.value==userData.value.id){
			if(!isThreeDays(item.recordDate))return false;
		}else{
			return false;
		}
		*/
		return false;
	}
	return true;
}
//计算运动消耗总热量
const countMotion = (item:any) =>{
	let count = 0;
	let motionList =  item.groupUserClockResponseParam?.filter((obj:any) => obj.type == 6);
	motionList.forEach((row:any) => {
		count +=row.sportsHeat;
	})
	return count;
}
//热量差计算
const countHeatGap = (item:any) => {
	return (item.rest+countMotion(item))-(item.breakfast+item.lunch+item.dinner+item.addFood);
}

//获取饮食打卡记录--------------------------------------------------------------------------------
//热量差计算
const countHeatGap2 = (item:any) => {
	return (item.rest+item.sports)-(item.breakfast+item.lunch+item.dinner+item.addFood);
}
//热量差平均值
const averageHeatGap = (list:any) => {
	if(list==null||list.length==0)return 0;
	//return 0
	let count = 0;
	for(let i=0;(i<list.length&&i<7);i++){
		count += countHeatGap2(list[i])
	}
	let divisor = 7
	if(list.length<7)divisor = list.length
	return Math.round(count / divisor);
}
const scrollFood = ref()
let paramsFood = {
	userId:"",
	groupId:"",
	recordType:10,
	page:1,
	rows:14,
	//pages:0,
	loading:false,//是否正在加载
}
const foodRecord:any = ref({});
const optionDataFood = ref();
const refreshFoodRecord = () => {
	paramsFood.page = 1;//设置刷新时查询第一页
	paramsFood.userId = currentUserId.value;
	paramsFood.groupId = groupId.value;
	getGroupUserHealthRecordType(paramsFood).then((res:any) => {
		if(res.success){
			paramsFood.page = res.data.nextPage;
			foodRecord.value = res.data;
			let echartsInfo = getEchartsInfoFood(foodRecord.value.list);
			optionDataFood.value = echartsInfo;
		}
		setTimeout(()=>{
		    scrollFood.value.success();
		},500);
	});
}
//翻页再加食物统计图数据
const updateFood = () => {
	if(paramsFood.loading)return;
	if(paramsFood.page==0)return;
	paramsFood.loading = true;
	paramsFood.userId = currentUserId.value;
	paramsFood.groupId = groupId.value;
	getGroupUserHealthRecordType(paramsFood).then((res:any) => {
		if(res.success){
			paramsFood.page = res.data.nextPage;
			foodRecord.value.list.push(...res.data.list);
			let echartsInfo = getEchartsInfoFood(foodRecord.value.list);
			optionDataFood.value = echartsInfo;
			//chartFood.value.updateData(echartsInfo);
		}
		paramsFood.loading = false;
		
	});
}
//根据集合获取日期个折线图
const getEchartsInfoFood = (list:any) => {
	let recordDateList = list.map((item:any) => moment(item.recordDate,"YYYY-MM-DD").format("MM/DD-YYYY").replace("-", "\n"));
	let foodHeatList = list.map((item:any) => {
		let heat = item.rest - (item.breakfast + item.lunch + item.dinner + item.addFood);
		//if(heat<0)heat = 0;
		return heat;
	});
	if(foodHeatList.length == 1)foodHeatList[1] = 0;
	return {
		recordDateList:recordDateList,
		foodHeatList:foodHeatList
	}
}
//获取饮水打卡记录---------------------------------------------------------------------------------------
//饮水平均值
const averageWater = (list:any) => {
	if(list==null||list.length==0)return 0;
	//return 0
	let count = 0;
	for(let i=0;(i<list.length&&i<7);i++){
		count += list[i].water;
	}
	let divisor = 7
	if(list.length<7)divisor = list.length
	return Math.round(count / divisor);
}
const scrollWater = ref()
let paramsWater = {
	userId:"",
	groupId:"",
	recordType:20,
	page:1,
	rows:14,
	//pages:0,
	loading:false,//是否正在加载
}
const waterRecord:any = ref({});
const optionDataWater = ref();
const refreshWaterRecord = () => {
	paramsWater.page = 1;//设置刷新时查询第一页
	paramsWater.userId = currentUserId.value;
	paramsWater.groupId = groupId.value;
	//console.log(paramsWater)
	getGroupUserHealthRecordType(paramsWater).then((res:any) => {
		//console.log(res)
		if(res.success){
			paramsWater.page = res.data.nextPage;
			waterRecord.value = res.data;
			let echartsInfo = getEchartsInfoWater(waterRecord.value.list);
			optionDataWater.value = echartsInfo;
			//计算平均饮水比例
			countTopDrinkWater(res.data.list)
		}
		setTimeout(()=>{
		    scrollWater.value.success();
		},500);
	});
}
//翻页再加饮水统计图数据
const updateWater = () => {
	if(paramsWater.loading)return;
	if(paramsWater.page==0)return;
	paramsWater.loading = true;
	paramsWater.userId = currentUserId.value;
	paramsWater.groupId = groupId.value;
	getGroupUserHealthRecordType(paramsWater).then((res:any) => {
		if(res.success){
			paramsWater.page = res.data.nextPage;
			waterRecord.value.list.push(...res.data.list);
			let echartsInfo = getEchartsInfoWater(waterRecord.value.list);
			optionDataFood.value = echartsInfo;
			//chartFood.value.updateData(echartsInfo);
		}
		paramsWater.loading = false;
	});
}
//根据集合获取日期个折线图
const getEchartsInfoWater = (list:any) => {
	let recordDateList = list.map((item:any) => moment(item.recordDate,"YYYY-MM-DD").format("MM/DD-YYYY").replace("-", "\n"));
	let waterList = list.map((item:any) => item.water);
	let needWaterList = list.map((item:any) => item.needWater);
	if(waterList.length == 1)waterList[1] = 0;
	if(needWaterList.length == 1)needWaterList[1] = 0;
	return {
		recordDateList:recordDateList,
		waterList:waterList,
		needWaterList:needWaterList
	}
}
//计算顶部饮水百分比
const waterProportion = ref(-1)
const countTopDrinkWater = (list:any) => {
	if(list==null||list.length==0)return -1;
	let averageValue =  averageWater(list);
	//averageValue/needWater
	waterProportion.value = Math.round((averageValue/list[0].needWater) * 100) / 100; 
}
//日期饮水比例
const countDateDrinkWater = (item:any) => {
	return Math.round((item.water/item.needWater) * 100) / 100; 
}

//获取运动打卡记录--------------------------------------------------------------------------------
//热量差平均值
const averageSports = (list:any) => {
	if(list==null||list.length==0)return 0;
	//return 0
	let count = 0;
	for(let i=0;(i<list.length&&i<7);i++){
		count += list[i].sports
	}
	let divisor = 7
	if(list.length<7)divisor = list.length
	return Math.round(count / divisor);
}
const scrollSports = ref()
let paramsSports = {
	userId:"",
	groupId:"",
	recordType:30,
	page:1,
	rows:14,
	//pages:0,
	loading:false,//是否正在加载
}
const sportsRecord:any = ref({});
const optionDataSports = ref();
const refreshSportsRecord = () => {
	paramsSports.page = 1;//设置刷新时查询第一页
	paramsSports.userId = currentUserId.value;
	paramsSports.groupId = groupId.value;
	getGroupUserHealthRecordType(paramsSports).then((res:any) => {
		//console.log(res)
		if(res.success){
			paramsSports.page = res.data.nextPage;
			sportsRecord.value = res.data;
			let echartsInfo = getEchartsInfoSports(sportsRecord.value.list);
			optionDataSports.value = echartsInfo;
		}
		setTimeout(()=>{
		    scrollSports.value.success();
		},500);
	});
}
//翻页再加食物统计图数据
const updateSports = () => {
	if(paramsSports.loading)return;
	if(paramsSports.page==0)return;
	paramsSports.loading = true;
	paramsSports.userId = currentUserId.value;
	paramsSports.groupId = groupId.value;
	getGroupUserHealthRecordType(paramsSports).then((res:any) => {
		if(res.success){
			paramsSports.page = res.data.nextPage;
			sportsRecord.value.list.push(...res.data.list);
			let echartsInfo = getEchartsInfoFood(sportsRecord.value.list);
			optionDataSports.value = echartsInfo;
			//chartFood.value.updateData(echartsInfo);
		}
		paramsSports.loading = false;
	});
}
//根据集合获取日期个折线图
const getEchartsInfoSports = (list:any) => {
	let recordDateList = list.map((item:any) => moment(item.recordDate,"YYYY-MM-DD").format("MM/DD-YYYY").replace("-", "\n"));
	let sportsList = list.map((item:any) => item.sports);
	if(sportsList.length == 1)sportsList[1] = 0;
	return {
		recordDateList:recordDateList,
		sportsList:sportsList
	}
}
//获取体重打卡记录---------------------------------------------------------------------------------------
const scrollAimWeight = ref()
let paramsAimWeight = {
	userId:"",
	groupId:"",
	recordType:40,
	page:1,
	rows:14,
	//pages:0,
	loading:false,//是否正在加载
}
const aimWeightRecord:any = ref({});
const optionDataAimWeight = ref();
const refreshAimWeightRecord = () => {
	paramsAimWeight.page = 1;//设置刷新时查询第一页
	paramsAimWeight.userId = currentUserId.value;
	paramsAimWeight.groupId = groupId.value;
	//console.log(paramsAimWeight)
	getGroupUserHealthRecordType(paramsAimWeight).then((res:any) => {
		//console.log(res)
		if(res.success){
			paramsAimWeight.page = res.data.nextPage;
			aimWeightRecord.value = res.data;
			let echartsInfo = getEchartsInfoAimWeight(aimWeightRecord.value.list);
			optionDataAimWeight.value = echartsInfo;
		}
		setTimeout(()=>{
		    scrollAimWeight.value.success();
		},500);
	});
}
//翻页再加饮水统计图数据
const updateAimWeight = () => {
	if(paramsAimWeight.loading)return;
	if(paramsAimWeight.page==0)return;
	paramsAimWeight.loading = true;
	paramsAimWeight.userId = currentUserId.value;
	paramsAimWeight.groupId = groupId.value;
	getGroupUserHealthRecordType(paramsAimWeight).then((res:any) => {
		if(res.success){
			paramsAimWeight.page = res.data.nextPage;
			aimWeightRecord.value.list.push(...res.data.list);
			let echartsInfo = getEchartsInfoAimWeight(aimWeightRecord.value.list);
			optionDataFood.value = echartsInfo;
			//chartFood.value.updateData(echartsInfo);
		}
		paramsAimWeight.loading = false;
	});
}
//根据集合获取日期个折线图
const getEchartsInfoAimWeight = (list:any) => {
	let recordDateList = list.map((item:any) => moment(item.recordDate,"YYYY-MM-DD").format("MM/DD-YYYY").replace("-", "\n"));
	let aimWeightList = list.map((item:any) => item.aimWeight);
	let needAimWeightList = list.map((item:any) => item.needAimWeight);
	if(aimWeightList.length == 1)aimWeightList[1] = 0;
	if(needAimWeightList.length == 1)needAimWeightList[1] = 0;
	return {
		recordDateList:recordDateList,
		aimWeightList:aimWeightList,
		needAimWeightList:needAimWeightList
	}
}

//计算BMI
const countBMI = (aimWeight:number,stature:number) => {
	if(stature==null||aimWeight==null)return 0;
	let m = new BigNumber(stature).div(new BigNumber(100));
	return Number(new BigNumber(aimWeight).div(m.times(m)).toNumber().toFixed(1));
}
const BMITip = (index:number) => {
	if(index<18.5)return "偏瘦";
	if(index>=18.5&&index<=23.9)return "正常";
	if(index>=24&&index<=29.9)return "偏重";
	if(index>=30&&index<=34.9)return "超重";
	if(index>34.9)return "严重超重";
}

//下拉加载
const scrollNull = () => {
	/*
	//console.log(pageData.value)
	if(params.page>=pageData.value.pages)return;
	getGroupUserHealthRecord(params).then((res: any) => {
		params.page++;//设置下一页
		pageData.value.list.push(...res.data.list)
	});
	*/
}

</script>

<style lang="scss" scoped>
@import "./clockinRecord.scss";
</style>
